<template>
  <div>
    <MyComponent>
      <slot>城市: {{cityName}}</slot>
    </MyComponent>

    <div id="provMap"></div>
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: "City",
  props: ["cityName"],
  data() {
    return {};
  },
  mounted() {
    axios
      .get(`http://iwenwiki.com/wapicovid19/guonei.php?city=${this.cityName}`)
      .then(res => {
        console.log(res);
        if (res.status === 200) {
          var cityList = [];
          for (var i = 0; i < res.data.retdata.subList.length; i++) {
            var temp = {
              name: res.data.retdata.subList[i].city + "市",
              value: res.data.retdata.subList[i].curConfirm
            };
            cityList.push(temp);
          }
          //   渲染echarts图表
          this.$charts.provinceMap("provMap", this.cityName, cityList);
        }
      });
  }
};
</script>

<style scoped lang="less">
#provMap {
  width: 100%;
  height: 500px;
}
</style>
